<html>
	<head>
	<link rel="stylesheet" href="/static/css/jquery.mobile.min.css" />
	<script src="/static/js/jquery.min.js"></script>
	<script src="/static/js/jquery.mobile.min.js"></script>
	<title>OYPAA 2013 Registration</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<script>
	  	$(document).bind('pageinit', function(event) {
	    $( "#delete_button" ).bind( "click", function(event, ui) {
	    	var item_key = $(this).attr("key");
	          });
	    });
	</script>
	</head>
	<body>
		<div data-role="page" data-theme="b" id="new_item">
			{% macro header(title) -%}
			<div data-role="header" id="header">
			<a href="/" data-icon="home" class="ui-btn-Left" data-theme="b">Home</a>
				<h1>{{ title }}</h1>
					<div data-role="navbar" data-id="nav">
        				<ul>
        						<li><a href="/admin" data-transition="slide">Registration list</a></li>
        						<li><a href="/admin" data-transition="slide">New Registration</a></li>
                            	<li><a href="/stats" data-transition="slide">Registration Statistics</a></li>
                            	<li><a href="/item" data-transition="slide">New Item</a></li>
        				</ul>
        			</div>
        	</div>
        	{%- endmacro %}
			{{ header('New Item') }}
	        <div data-role="content">
	        	<div>
	        	<ul>
				{% for item in items %}
				  <li>{{ item.title }}: {{ item.price }}</li>
				{% endfor %}
				</ul>
	        	</div>
		        <form action="/item" method="post">
					<div class="registration_form" style="text-align:center;" data-role="fieldcontain">
			           <label class="ui-hidden-accessible" for="title">Title:</label><input data-mini="true" type="text" id="title" name="title" value="" placeholder="Title"><br>
			           <label class="ui-hidden-accessible" for="price">Price:</label><input data-mini="true" type="text" id="price" name="price" value="" placeholder="Price"><br>
					</div>
					<div class="item_form" style="text-align:center;" data-role="fieldcontain">
					    <input type="submit" value="Enter Item">
					</div>
				</form>
			</div>
		</div>
	</body>
</html>